
/*轮播图*/
$(function () {
    var i = 0;
    var m = $(".imgChange").width();
    var clone = $(".imgChange").first().clone();//克隆第一张图片
    $(".imgTransparent").append(clone);    //复制到列表最后,append()方法在被选元素的结尾插入指定内容
    var size = $(".imgChange").size();   //返回匹配元素的数量
    console.log(size);

    /*循环图片容器的数量，并且向点点按钮的大容器添加几个子节点作为点点按钮*/
    for (var j = 0; j < size-1; j++) {
        $(".num").append("<li></li>");
    }

    $(".num li").first().addClass("on");

    /*自动轮播*/
    var t = setInterval(function () {
        i++;
        move();
    },4000);

    /*鼠标悬停事件*/
    $(".imgBanner").hover(function () {
        clearInterval(t);//鼠标悬停时清除定时器
    }, function () {
        t = setInterval(function () {
            i++;
            move();
        }, 4000); //鼠标移出时开始定时器
    });

    /*鼠标点击圆点事件*/
    $(".num li").click(function () {
        var index = $(this).index();//获取当前索引值
        i = index;
        $(".imgTransparent").stop().animate({ left: -index * m}, 500);
        /*siblings()方法返回被选元素的所有同级元素，同级元素是共享相同父元素的元素*/
        $(this).addClass("on").siblings().removeClass("on");
    });

    /*向左按钮*/
    $(".btn_l").click(function () {
        i--;
        move();
    });
    /*向右按钮*/
    $(".btn_r").click(function () {
        i++;
        move();
    });

    /*移动事件*/
    function move() {
        if (i === size) {
            $(".imgTransparent").css({ left: 0 });
            i = 1;
        }
        if (i === -1) {
            $(".imgTransparent").css({ left: -(size - 1) * m });
            i = size - 2;
        }
        $(".imgTransparent").stop().animate({ left: -i * m }, 700);
        if (i === size - 1) {
            $(".num li").eq(0).addClass("on").siblings().removeClass("on");
        } else {
            $(".num li").eq(i).addClass("on").siblings().removeClass("on");
        }
    }
});
